<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>CSS样式</title>
		<!--html中元素自带属性和属性值 做单个元素的效果
		    css样式表  整体或单个元素的效果
			使用css--1.引入css3样式【4种】
			          1.1内联样式表 不建议使用 没有实现内容与表现分离
					  1.2内部样式表 联系专用
					    1.2.1使用方式 --head元素 添加style元素
						1.2.2编写css语法 选择器--元素选择器：抓取页面元素
					  1.3外部样式表  项目专用
					    1.3.1 使用方式---head元素 tianjialink元素 指定css文件
						1.3.2创建 xxx。css 文件
					  1.4引入样式表  不用 致命bug
					    1.4.1 使用--head元素  添加style元素
						1.4.2 创建xxx。css文件
						1.4.3 在style元素中加入@import（xxx.css）
						缺点：项目内容大  先执行结构执行出来，等一会，效果加不上不上
						     先执行效果css 然后再执行结构html
			         2.编写css3语法:css属性和属性值使用
		-->
	<style>
		@import url(css/引入样式表.css);
		/*css3的注释*/
		p{
		     /*css3属性和属性值：添加【样式】效果*/
			/*效果：居中*/
			text-align: center;
			/*效果：背景颜色 色值：十六进制 网页三原色：红绿蓝*/
			background-color: #e4393c; /*京东红 主题色*/
			/*效果：文本放大*/
			font-size: 50px;
			/*效果：宽高*/
			width: 249px;
			height: 249px;
			/*效果：行高与高度一致：垂直居中*/
			line-height: 249px;
		}
	</style>
	<link rel="stylesheet" href="css/index.css">
	</head>
	<body>
		<!--html效果-->
		<p>lorem1</p>
		<!--css 效果-->
		<p>lorem2</p>
		<span>行元素内容</span>
	</body>
</html>
